{% extends '::base.html.twig' %}

{% block title %}Inicio{% endblock %}

{% block body -%}
 <div class="container">
  <div class="col-md-12">
 <h4 id="sec0">Inspecciones</h4>
   <hr class="col-md-11 superior">
   <div class="col-md-12"> 
 
      
      
      <table style="margin-left: 15px;" class="table table-hover  table-condensed table-curved tabla-listados-inspecciones">
          <caption><h4>Inspecciones a las Entidades de Atenci&oacute;n</h4></caption>
          <tr>
              <th>Tipo de Inspección</th>
              <th>Validadas</th>
              <th>Pendientes</th>
          </tr>
      <tr>
        <td>Femeninas</td>
        <td>{{ cantFemValidadas }}</td>
        <td>{{ cantFemPendientes }}</td>
      </tr>
      <tr>
        <td>Masculinas</td>    
        <td>{{ cantMasValidadas }}</td>
        <td>{{ cantMasPendientes }}</td>
      </tr>      
     </table>
    </div>
    <div class="col-md-12"> 
          <table style="margin-left: 15px;" class="table table-hover  table-curved tabla-listados-inspecciones">
              <caption><h4>Inspecciones a la Poblaci&oacute;n de las Entidades de Atenci&oacute;n</h4></caption>
              <tr>
                  <th>Tipo de Inspección</th>
                  <th>Tipo de Medida</th>
                  <th>Validadas</th>
                  <th>Pendientes</th>
              </tr>
              <tr>
                  <td>Femeninas</td>
                  <td>Privación de Libertad</td>
                  <td>{{ cantFemPrivPobValidadas }}</td>
                  <td>{{ cantFemPrivPobPendientes }}</td>
              </tr>
              <tr>
                  <td>Femeninas</td>
                  <td>Semi-Libertad</td>
                  <td>{{ cantFemSemiPobValidadas }}</td>
                  <td>{{ cantFemSemiPobPendientes }}</td>        
              </tr>
              
              <tr>
                  <td>Masculinas</td>
                  <td>Privación de Libertad</td>
                  <td>{{ cantMasPrivPobValidadas }}</td>
                  <td>{{ cantMasPrivPobPendientes }}</td>       
              </tr>
              <tr>
                  <td>Masculinas</td>
                  <td>Semi-Libertad</td>
                  <td>{{ cantMasSemiPobValidadas }}</td>
                  <td>{{ cantMasSemiPobPendientes }}</td>        
              </tr>              
          </table>
              
      </div>

       </div>       
         <div class="col-md-6">    
  <ul class="list-group" >
  <li class="list-group-item" style="background: #9BCC13;">
    <b >Inspecciones a Entidades de Atencion</b>
  </li>        
  <li class="list-group-item">
    <span class="badge">14</span>
    Cant. Total de Inspecciones  por Validar
  </li>
    <li class="list-group-item">
        <span class="badge"  ><a style="list-style:none; color:white;" href="#" id="ver-link" data-toggle="modal" data-target="#myModal">Ver</a></span>  
    <span class="badge">14</span>
    Cant. Total de Inspecciones Validadas
  </li>
  <li class="list-group-item">
    <span class="badge">14</span>
    Cant. Total de Inspecciones Registradas
  </li>
</ul>
   </div> 
       <div class="col-md-6">        
  <ul class="list-group">
  <li class="list-group-item" style="background: #EFB510;">
    <b>Inspecciones Registradas por Usuario</b>
  </li>        
     
  {% for usuario in usuariosSedes %}
   <li class="list-group-item">
        <span class="badge"><a style="list-style:none; color:white;" href="#" id="ver-link" data-toggle="modal" data-target="#myModal">Ver</a></span>
        <span class="badge">14</span>
        {{ usuario.usuario.username}}
    {% endfor %}
</li>
</ul>
   <ul class="list-group">
  <li class="list-group-item" style="background: #EFB510;">
    <b>Inspecciones Registradas por Estado</b>
  </li>        
     
  {% for estado in estados  if estado.id != 999%}
   <li class="list-group-item">
          <span class="badge" ><a style="list-style:none; color:white;" href="#" id="ver-link" data-toggle="modal" data-target="#myModal">Ver</a></span>       
        <span class="badge">14</span>

        {{ estado.nbEstado}}
    {% endfor %}
   </li>
     </ul>
  </div> 
</div>
   
   
   
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
        <h4 class="modal-title">Modal title</h4>
      </div>
      <div class="modal-body">
        <p>One fine body&hellip;</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
       </div>
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->
{% endblock %}
{% block javascripts %}
<script>
$('#ver-link').click(function(e){
    e.preventDefault();
});
//$('.modal').modal('show');
</script>
{% endblock %}